/*
 * Copyright © 2015 Cask Data, Inc.
 *
 * Licensed under the Apache License, Version 2.0 (the "License"); you may not
 * use this file except in compliance with the License. You may obtain a copy of
 * the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
 * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
 * License for the specific language governing permissions and limitations under
 * the License.
 */

 @import "../../styles/variables.less";
 @import "../../styles/themes/cdap/mixins.less";
 @import "../../../bower_components/bootstrap/less/mixins.less";

@navbar-bg: #464a56;
@border-color: #cdcdcd;

my-search {
  .navbar-item { // this is because of specificity
    .search-box {
      z-index: 955;
      .form-group {
        margin-top: 11px;
        z-index: 955;

        .form-control {
          height: 28px;
        }
        .form-control-feedback {
          color: @navbar-bg;
          vertical-align: middle;
          line-height: 25px;
        }
      }
    }

    &.has-results {
      background-color: white;
      color: @navbar-bg;
      border-bottom: 1px solid @border-color;

      .form-group {
        .form-control {
          background-color: @navbar-bg;
          color: white;
        }

        .form-control-feedback {
          color: white;
        }
      }
    }
  }

  .search-results {
    width: 450px;
    max-height: 500px;
    position: absolute;
    background-color: white;
    top: 50px;
    transform: translateX(-20px);
    cursor: default;
    font-size: 14px;
    line-height: 35px;
    padding-top: 15px;
    padding-bottom: 15px;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    z-index: 955;
    overflow-y: auto;

    .box-shadow(0 7px 15px 1px fade(black, 30%));

    h4 {
      color: @navbar-bg;
      font-weight: 500;
    }

    .result-info, .truncate-ellipsis {
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
    }

    .entity-details, .entity-app-details {
      color: #999999;
      span {
        vertical-align: middle;
      }
    }

    .entity-app-details { margin-left: 15px; }
  }

  .blank-click-handler {
    position: absolute;
    top: 0;
    left: 0;
    height: 100vh;
    width: 100vw;
    z-index: 950;
    cursor: default;
  }
}
